<!DOCTYPE html>
<html style="height: 100%;">

<head>
	<title>Light Control</title>
	<style>
		html, body{margin:0 0 0 0; height:100%;padding: 0 0 0 0; overflow:none;}
		#parent { display: table; width: 100%; height: 100%; border-collapse: collapse;}
		#child1 { display: table-row;}
		#container { display: table-row; height:100%; border: 0px solid red;}
	</style>
</head>
<body>
	<script src="jscolor.js.html"></script>
	<div id="parent">
		<div id="child1">
			<button style="width:100%;padding:20px 0px 20px 0px;" class="jscolor {valueElement:'valueInput'}">
				<h2>Light Color<h2>
			</button><input id="valueInput" class="jscolor" style="display:none" value="ff6699" onchange="setTextColor(this.value)"><br>

		</div>
		<div id="container"></div>
	</div>

	<script>
		var pinID = 0;

		function setTextColor(rgbColor) {
			pinID++;
			document.title = "RGB:" + rgbColor;
			window.location.hash = pinID;
		}
	</script>
</body>
</html>
